<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>编辑视频 - 三石影视</title>
    <script src="https://cdn.tailwindcss.com"></script>
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0/css/all.min.css">
</head>
<body class="bg-gray-100">
    <!-- 导航栏 -->
    <nav class="bg-white shadow-lg">
        <div class="max-w-7xl mx-auto px-4">
            <div class="flex justify-between h-16">
                <div class="flex">
                    <div class="flex-shrink-0 flex items-center">
                        <a href="{{ url_for('index') }}" class="text-2xl font-bold text-gray-800">三石影视</a>
                    </div>
                </div>
                <div class="flex items-center">
                    <div class="relative" id="userMenu">
                        <button id="userMenuBtn" class="flex items-center text-gray-700 hover:text-gray-900">
                            <i class="fas fa-user-circle text-2xl"></i>
                        </button>
                        <div id="userDropdown" class="hidden absolute right-0 mt-2 w-48 bg-white rounded-md shadow-lg py-1">
                            <a href="{{ url_for('profile') }}" class="block px-4 py-2 text-sm text-gray-700 hover:bg-gray-100">个人中心</a>
                            <a href="{{ url_for('admin_dashboard') }}" class="block px-4 py-2 text-sm text-gray-700 hover:bg-gray-100">管理控制台</a>
                            <a href="{{ url_for('logout') }}" class="block px-4 py-2 text-sm text-gray-700 hover:bg-gray-100">退出登录</a>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </nav>

    <!-- 主要内容 -->
    <div class="max-w-7xl mx-auto py-6 sm:px-6 lg:px-8">
        <!-- 页面标题 -->
        <div class="mb-6">
            <h1 class="text-2xl font-semibold text-gray-900">编辑视频</h1>
        </div>

        <!-- 编辑视频表单 -->
        <div class="bg-white shadow rounded-lg">
            <form action="{{ url_for('admin_edit_video', video_id=video.id) }}" method="POST" class="p-6" id="editVideoForm">
                <div class="grid grid-cols-1 md:grid-cols-2 gap-6">
                    <!-- 基本信息 -->
                    <div class="space-y-6">
                        <div>
                            <label for="title" class="block text-sm font-medium text-gray-700">标题</label>
                            <input type="text" name="title" id="title" value="{{ video.title }}" required
                                class="mt-1 block w-full rounded-md border-gray-300 shadow-sm focus:border-indigo-500 focus:ring-indigo-500">
                        </div>

                        <div>
                            <label for="description" class="block text-sm font-medium text-gray-700">描述</label>
                            <textarea name="description" id="description" rows="3" required
                                class="mt-1 block w-full rounded-md border-gray-300 shadow-sm focus:border-indigo-500 focus:ring-indigo-500">{{ video.description }}</textarea>
                        </div>

                        <div>
                            <label for="cover" class="block text-sm font-medium text-gray-700">封面图片URL</label>
                            <input type="url" name="cover" id="cover" value="{{ video.cover }}" required
                                class="mt-1 block w-full rounded-md border-gray-300 shadow-sm focus:border-indigo-500 focus:ring-indigo-500">
                        </div>

                        <div>
                            <label for="url" class="block text-sm font-medium text-gray-700">视频URL</label>
                            <input type="url" name="url" id="url" value="{{ video.url }}" required
                                class="mt-1 block w-full rounded-md border-gray-300 shadow-sm focus:border-indigo-500 focus:ring-indigo-500">
                        </div>
                    </div>

                    <!-- 详细信息 -->
                    <div class="space-y-6">
                        <div>
                            <label for="category" class="block text-sm font-medium text-gray-700">分类</label>
                            <select name="category" id="category" required
                                class="mt-1 block w-full rounded-md border-gray-300 shadow-sm focus:border-indigo-500 focus:ring-indigo-500">
                                <option value="movie" {% if video.category == 'movie' %}selected{% endif %}>电影</option>
                                <option value="tv" {% if video.category == 'tv' %}selected{% endif %}>电视剧</option>
                                <option value="anime" {% if video.category == 'anime' %}selected{% endif %}>动漫</option>
                                <option value="variety" {% if video.category == 'variety' %}selected{% endif %}>综艺</option>
                            </select>
                        </div>

                        <div>
                            <label for="tags" class="block text-sm font-medium text-gray-700">标签（用逗号分隔）</label>
                            <input type="text" name="tags" id="tags" value="{{ video.tags|join(',') }}"
                                class="mt-1 block w-full rounded-md border-gray-300 shadow-sm focus:border-indigo-500 focus:ring-indigo-500">
                        </div>

                        <div>
                            <label for="rating" class="block text-sm font-medium text-gray-700">评分</label>
                            <input type="number" name="rating" id="rating" min="0" max="10" step="0.1" value="{{ video.rating }}"
                                class="mt-1 block w-full rounded-md border-gray-300 shadow-sm focus:border-indigo-500 focus:ring-indigo-500">
                        </div>

                        <div>
                            <label for="views" class="block text-sm font-medium text-gray-700">浏览量</label>
                            <input type="number" name="views" id="views" min="0" value="{{ video.views }}"
                                class="mt-1 block w-full rounded-md border-gray-300 shadow-sm focus:border-indigo-500 focus:ring-indigo-500">
                        </div>

                        <div>
                            <label for="year" class="block text-sm font-medium text-gray-700">年份</label>
                            <input type="number" name="year" id="year" min="1900" max="2100" value="{{ video.year }}"
                                class="mt-1 block w-full rounded-md border-gray-300 shadow-sm focus:border-indigo-500 focus:ring-indigo-500">
                        </div>

                        <div>
                            <label for="director" class="block text-sm font-medium text-gray-700">导演</label>
                            <input type="text" name="director" id="director" value="{{ video.director }}"
                                class="mt-1 block w-full rounded-md border-gray-300 shadow-sm focus:border-indigo-500 focus:ring-indigo-500">
                        </div>

                        <div>
                            <label for="cast" class="block text-sm font-medium text-gray-700">主演</label>
                            <input type="text" name="cast" id="cast" value="{{ video.cast }}"
                                class="mt-1 block w-full rounded-md border-gray-300 shadow-sm focus:border-indigo-500 focus:ring-indigo-500">
                        </div>

                        <div>
                            <label for="region" class="block text-sm font-medium text-gray-700">地区</label>
                            <input type="text" name="region" id="region" value="{{ video.region }}"
                                class="mt-1 block w-full rounded-md border-gray-300 shadow-sm focus:border-indigo-500 focus:ring-indigo-500">
                        </div>
                    </div>
                </div>

                <!-- 提交按钮 -->
                <div class="mt-6 flex justify-end space-x-3">
                    <a href="{{ url_for('admin_videos') }}"
                        class="inline-flex items-center px-4 py-2 border border-gray-300 text-sm font-medium rounded-md text-gray-700 bg-white hover:bg-gray-50">
                        取消
                    </a>
                    <button type="submit"
                        class="inline-flex items-center px-4 py-2 border border-transparent text-sm font-medium rounded-md text-white bg-indigo-600 hover:bg-indigo-700">
                        保存修改
                    </button>
                </div>
            </form>
        </div>
    </div>

    <script>
    document.addEventListener('DOMContentLoaded', function() {
        // 用户菜单显示控制
        const userMenuBtn = document.getElementById('userMenuBtn');
        const userDropdown = document.getElementById('userDropdown');

        if (userMenuBtn && userDropdown) {
            userMenuBtn.addEventListener('click', (e) => {
                e.stopPropagation();
                userDropdown.classList.toggle('hidden');
            });
            
            // 点击其他地方关闭菜单
            document.addEventListener('click', (e) => {
                if (!userMenuBtn.contains(e.target) && !userDropdown.contains(e.target)) {
                    userDropdown.classList.add('hidden');
                }
            });
        }

        // 显示提示框
        function showToast(message, type = 'success') {
            const toast = document.getElementById('toast');
            const toastMessage = document.getElementById('toast-message');
            if (!toast || !toastMessage) return;

            toast.className = `fixed top-4 right-4 px-6 py-3 rounded-lg shadow-lg transform translate-y-[-100%] opacity-0 transition-all duration-300 ${
                type === 'success' ? 'bg-green-600' : 'bg-red-600'
            } text-white`;
            
            toastMessage.textContent = message;
            toast.style.transform = 'translateY(0)';
            toast.style.opacity = '1';
            
            setTimeout(() => {
                toast.style.transform = 'translateY(-100%)';
                toast.style.opacity = '0';
            }, 3000);
        }

        // 图片上传预览
        const coverInput = document.getElementById('cover');
        const coverPreview = document.getElementById('cover-preview');
        
        if (coverInput && coverPreview) {
            coverInput.addEventListener('change', function(e) {
                const file = e.target.files[0];
                if (file) {
                    const reader = new FileReader();
                    reader.onload = function(e) {
                        coverPreview.src = e.target.result;
                        coverPreview.classList.remove('hidden');
                    };
                    reader.readAsDataURL(file);
                }
            });
        }

        // 表单验证
        const editVideoForm = document.getElementById('editVideoForm');
        if (editVideoForm) {
            editVideoForm.addEventListener('submit', function(e) {
                e.preventDefault();
                
                const title = document.getElementById('title').value.trim();
                const description = document.getElementById('description').value.trim();
                
                if (!title) {
                    showToast('请输入视频标题', 'error');
                    return;
                }
                
                if (!description) {
                    showToast('请输入视频描述', 'error');
                    return;
                }
                
                // 提交表单
                const formData = new FormData(this);
                fetch(window.location.pathname, {
                    method: 'POST',
                    body: formData
                })
                .then(response => response.json())
                .then(data => {
                    if (data.success) {
                        showToast('视频更新成功');
                        setTimeout(() => {
                            window.location.href = '/admin/videos';
                        }, 1000);
                    } else {
                        showToast(data.error || '更新视频失败', 'error');
                    }
                })
                .catch(error => {
                    console.error('更新视频失败:', error);
                    showToast('更新视频失败', 'error');
                });
            });
        }

        // 为所有按钮添加加载状态
        document.querySelectorAll('button').forEach(button => {
            button.addEventListener('click', function() {
                if (this.dataset.loading !== 'true') {
                    const originalText = this.innerHTML;
                    this.innerHTML = '<i class="fas fa-spinner fa-spin"></i> 处理中...';
                    this.dataset.loading = 'true';
                    this.disabled = true;

                    setTimeout(() => {
                        this.innerHTML = originalText;
                        this.dataset.loading = 'false';
                        this.disabled = false;
                    }, 2000);
                }
            });
        });
    });
    </script>
</body>
</html> 